<!--
 * @Description: 历史留言列表
 * @Author: Kerwin
 * @Date: 2025-04-27 17:30:11
 * @LastEditTime: 2025-05-30 12:01:39
 * @LastEditors:  Please set LastEditors
-->
<template>
  <view class="bigbox">
    <view style="text-align: right; margin-bottom: 20rpx">
      <!-- 重新加载图标 -->
      <u-icon
        name="reload"
        size="40"
        @click="getMessageList"
        style="cursor: pointer"
      ></u-icon>
    </view>
    <template v-if="messageList.length > 0">
      <view
        class="lybox"
        v-for="item in messageList"
        :key="item.id"
        style="background-color: #fff"
        @click="handleGoDetail(item)"
      >
        <u-cell-item
          title-style="font-size: 32rpx"
          :title="item.remark"
        ></u-cell-item>
      </view>
      <!-- 返回顶部按钮 -->
      <u-back-top :scroll-top="scrollTop"></u-back-top>
    </template>
    <view class="empty" v-else>
      <u-empty text="暂无数据哦~" mode="list"></u-empty>
    </view>
  </view>
</template>
<script setup lang="ts">
import { ref, onMounted } from 'vue'
import { onLoad, onReady, onPageScroll } from '@dcloudio/uni-app'
import { baseApi } from '@/api'
import { useUserStore } from '@/store'
import { storeToRefs } from 'pinia'
const userStore = useUserStore()
const { userInfo } = storeToRefs(userStore)
// 模式类型
const modelType = ref<any>(uni.getStorageSync('selfServiceModelType'))
const messageList = ref<any>([])
const scrollTop = ref(0)
onLoad(() => {
  getMessageList()
})
const getMessageList = async () => {
  const { data } = await baseApi.getLeaveMessageList({
    channelId: 1,
    detail: true,
    noPaging: true,
    integralsRuleId: modelType.value,
    userId: userInfo.value.id
  })
  if (data && data.length > 0) {
    messageList.value = data
  } else {
    messageList.value = []
  }
}
const handleGoDetail = (item: any) => {
  // console.log(item, '详情')
  uni.navigateTo({
    url: '/packageA/pages/leaveMessage/messageDetail?id=' + item.id
  })
}
//返回顶部,所在的父盒子不能设置高度
onPageScroll((e: any) => {
  scrollTop.value = e.scrollTop
})
</script>
<style lang="scss" scoped>
.bigbox {
  padding: 20rpx;
  .lybox {
    margin-bottom: 20rpx;
  }
}
</style>
